import { Component, OnInit, Input, OnDestroy } from '@angular/core';
import { UserService } from 'src/app/service/user.service';
import { YearawardService } from '../../../yearaward.service';
import { BaseService } from 'src/app/service/base.service';
import { UtilsService } from 'src/app/service/utils.service';

@Component({
  selector: 'app-sally',
  templateUrl: './index.component.html',
  styleUrls: ['./index.component.scss', '../../../commonList.scss'],
})
export class SallyComponent implements OnInit, OnDestroy {
  @Input() timeConfig: any[] = [];
  /* ___ _ ___ */
  public deployUrl: string; /* 资源地址前缀 */
  /* ___ _ ___ */
  public isPC = false; /* 是否pc */
  public flag = false;
  public reshing = null;
  public isAndroid = false; /* 是否安卓 */
  public onRefrash: any; /* 刷新中 */
  public isRuleClose = true; /* 规则是否展开 */
  public pageSize = 50; /* 每页条数 */
  public stageId: number; //请求数据ID
  public activityStartThis = 'notstart'; // 是否已经结榜
  public nowDate: any;
  public top = 0; // window.scrollY，用来判断弹出窗口后页面不可滚动
  public isDialog = false;
  /* ___ _ ___ */
  public othersList: any[] = []; /* 危险区 */
  public curProgress = 0; /* 第*轮 */
  public championPool: number = 0;
  public othersIndex = 0;
  public dangerIndex = 0;
  public countdown: number = 0;
  public countdownTimes: number = 25000;
  public haveCount: boolean = false;
  public showCountDown: string = '0';
  public site = 0;

  public curProgressStyle = {
    top: '0',
    left: '1.34rem',
  };
  public timeArr: any = [];
  public currentAnchorInfo: any = {
    nickname: '',
    avatarUrl: '',
    score: 0,
    rankDesc: '-',
    rank: 0,
    isMysteryMan: false,
  }; /* 当前主播信息 */

  constructor(
    private userService: UserService,
    private yearawardService: YearawardService,
    private baseService: BaseService,
    private utilsservice: UtilsService
  ) {}

  ngOnInit(): void {
    // 获取
    this.deployUrl = this.userService.getDeployUrl();
    this.isPC = this.userService.getIsPc();
    this.isAndroid = this.utilsservice.getBrowserVersion();
    this.initPage();
    // 组件刷新通信
    this.reshing = this.utilsservice.MsgSub.subscribe((res: any) => {
      this.initPage();
    });
  }
  ngOnDestroy() {
    if (this.reshing) {
      this.reshing.unsubscribe();
    }
  }
  public initPage() {
    this.getChampionPool();
  }

  // 获取冠军奖池
  public getChampionPool() {
    this.yearawardService.championPool(
      (res: any) => {
        if (res.code === 200) {
          this.championPool = res.data.championPool;
          this.site = res.data.site;
          if (this.site > 0) {
            this.pkFinalsRank();
          }
        }
      },
      (err: any) => {}
    );
  }
  //获取榜单
  public pkFinalsRank() {
    this.yearawardService.pkFinalsRank(
      (res: any) => {
        if (res.code === 200) {
          this.curProgress = res.data.round;
          if (this.curProgress === 10) {
            this.countdownTimes = 35000;
          }
          this.countdown = res.data.countdown;
          if (this.curProgress != 0) {
            this.getCurProgressStyle();
            if (this.haveCount == false) {
              this.haveCount = true;
              this.countdownTime();
            }
          }
          this.othersList = res.data.list;
          this.currentAnchorInfo = res.data.current || {};
          // this.top3List = res.data.list.slice(0, 3); /* TOP3 */
          // if (this.curProgress >= 5) {
          //   if (this.curProgress == 5) {
          //     this.othersIndex = 29;
          //     this.dangerIndex = 25;
          //     this.safetyList = res.data.list.slice(
          //       4,
          //       25
          //     ); /* TOP3 */ /* 安全区 */
          //     this.dangersList = res.data.list.slice(24, 28); /* 危险区 */
          //     this.othersList = res.data.list.slice(28); /* TOP3 */ /* 危险区 */
          //   }
          //   if (this.curProgress == 6) {
          //     this.othersIndex = 25;
          //     this.dangerIndex = 21;
          //     this.safetyList = res.data.list.slice(
          //       4,
          //       21
          //     ); /* TOP3 */ /* 安全区 */
          //     this.dangersList = res.data.list.slice(
          //       20,
          //       24
          //     ); /* TOP3 */ /* 危险区 */
          //     this.othersList = res.data.list.slice(24); /* 危险区 */
          //   }
          //   if (this.curProgress == 7) {
          //     this.othersIndex = 21;
          //     this.dangerIndex = 17;
          //     this.safetyList = res.data.list.slice(
          //       4,
          //       17
          //     ); /* TOP3 */ /* 安全区 */
          //     this.dangersList = res.data.list.slice(
          //       16,
          //       20
          //     ); /* TOP3 */ /* 危险区 */
          //     this.othersList = res.data.list.slice(20); /* 危险区 */
          //   }
          //   if (this.curProgress == 8) {
          //     this.othersIndex = 17;
          //     this.dangerIndex = 13;
          //     this.safetyList = res.data.list.slice(
          //       4,
          //       13
          //     ); /* TOP3 */ /* 安全区 */
          //     this.dangersList = res.data.list.slice(
          //       12,
          //       16
          //     ); /* TOP3 */ /* 危险区 */
          //     this.othersList = res.data.list.slice(16); /* 危险区 */
          //   }
          //   if (this.curProgress == 9) {
          //     this.othersIndex = 13;
          //     this.dangerIndex = 9;
          //     this.safetyList = res.data.list.slice(
          //       4,
          //       9
          //     ); /* TOP3 */ /* 安全区 */
          //     this.dangersList = res.data.list.slice(
          //       8,
          //       12
          //     ); /* TOP3 */ /* 危险区 */
          //     this.othersList = res.data.list.slice(12); /* 危险区 */
          //   }
          //   if (this.curProgress == 10) {
          //     if (this.site > 10) {
          //       this.othersIndex = 7;
          //       this.countdownTimes = 35000;
          //       this.safetyList = res.data.list.slice(
          //         3,
          //         6
          //       ); /* TOP3 */ /* 安全区 */
          //       this.othersList = res.data.list.slice(6); /* 危险区 */
          //     } else {
          //       this.othersIndex = 9;
          //       this.dangerIndex = 7;
          //       this.safetyList = res.data.list.slice(
          //         4,
          //         7
          //       ); /* TOP3 */ /* 安全区 */
          //       this.dangersList = res.data.list.slice(
          //         6,
          //         8
          //       ); /* TOP3 */ /* 危险区 */
          //       this.othersList = res.data.list.slice(8); /* 危险区 */
          //     }
          //   }

          //   /* 淘汰区 */
          // } else {
          //   this.dangerIndex = 29;
          //   this.safetyList = res.data.list.slice(
          //     4,
          //     29
          //   ); /* TOP3 */ /* 安全区 */
          //   this.dangersList = res.data.list.slice(28); /* TOP3 */ /* 危险区 */
          //   this.othersList = res.data.list.slice(28); /* TOP3 */ /* 危险区 */
          // }
        }
      },
      this.baseService.getCurrentId(),
      0,
      (err: any) => {}
    );
  }

  /**
   * @description: 获取当前主播
   */
  getCurrentAnchor() {
    const ob = this.yearawardService.getCurrentUserRanking(
      (res) => {
        if (res.code === 200) {
          this.currentAnchorInfo = res.data;
        } else {
          this.baseService.showToast(res.message, 1500);
        }
      },
      1,
      () => {}
    );
  }

  /**
   * @param val 是否为关闭状态
   * @description: 切换展开/收起
   */
  onRuleAccordionChange(val: boolean) {
    this.isRuleClose = val;
  }
  /**
   * @description: 获取当前轮数的定位样式
   */
  getCurProgressStyle() {
    if (this.curProgress > 5) {
      let curProgressleft = this.curProgress - 5;
      this.curProgressStyle.top = '0.7' + 'rem';
      if (this.curProgress === 10) {
        this.curProgressStyle.left = '5.26rem';
      }else{
        this.curProgressStyle.left = 1.3 * (curProgressleft - 1) + 'rem';
      }
    } else {
      this.curProgressStyle.top = '0';
      if (this.curProgress === 5) {
        this.curProgressStyle.left = '5.26rem';
      }else{
        this.curProgressStyle.left = 1.3 * (this.curProgress - 1) + 'rem';
      }
    }
  }
  // 跳转直播间
  public gotoRoom(item: any, type: any) {
    if (this.site < 11) {
      return;
    }
    if (
      (type === 'anchor' && !item.uid) ||
      (type === 'user' && !item.userUid)
    ) {
      return;
    }
    const obj = { ...item };
    if (type === 'anchor') {
      obj.isMysteryMan = false;
    }
    // obj.livImage = item.avatarUrl;
    this.utilsservice.gotoRoom(obj, type);
  }

  public countdownTime() {
    if (this.countdown == 0 && this.site <= 10) {
      this.haveCount = false;
      setTimeout(() => {
        this.getChampionPool();
      }, this.countdownTimes);
      return;
    }
    this.countdown = this.countdown - 1;
    let m = Math.floor((this.countdown / 60) % 60);
    let s = Math.floor(this.countdown % 60);

    this.showCountDown = this.add0(m) + ':' + this.add0(s);
    setTimeout(() => {
      this.countdownTime();
    }, 1000);
  }
  public add0(m: number): string {
    return m < 10 ? '0' + m : m + '';
  }
  // 点击弹窗
  public closeShow(val) {
    const bodyEl = document.body;
    if (val) {
      this.top = window.scrollY;
      bodyEl.style.position = 'fixed';
      bodyEl.style.top = -this.top + 'px';
    } else {
      bodyEl.style.position = '';
      bodyEl.style.top = '';
      window.scrollTo(0, this.top); // 回到原先的top
    }
    this.isDialog = val;
  }
}
